let questionArr = [
    { id: 1, serialNumber: 1, poolName: "语文试卷", classificationHierarchy: "一级", sortTheValue: 1, createdBy: "周佳", lastModified: "2023-05-12 18:43:09" },
    { id: 2, serialNumber: 2, poolName: "数学试卷", classificationHierarchy: "二级", sortTheValue: 2, createdBy: "周琦", lastModified: "2023-05-12 18:43:09" },
    { id: 3, serialNumber: 3, poolName: "物理试卷", classificationHierarchy: "一级", sortTheValue: 3, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
    { id: 4, serialNumber: 4, poolName: "语文试卷", classificationHierarchy: "一级", sortTheValue: 4, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
    { id: 5, serialNumber: 5, poolName: "英语试卷", classificationHierarchy: "一级", sortTheValue: 5, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
    { id: 6, serialNumber: 6, poolName: "语文试卷", classificationHierarchy: "一级", sortTheValue: 6, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
    { id: 7, serialNumber: 7, poolName: "化学试卷", classificationHierarchy: "一级", sortTheValue: 7, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
    { id: 8, serialNumber: 8, poolName: "语文试卷", classificationHierarchy: "一级", sortTheValue: 8, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
    { id: 9, serialNumber: 9, poolName: "数学试卷", classificationHierarchy: "一级", sortTheValue: 9, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
    { id: 10, serialNumber: 10, poolName: "语文试卷", classificationHierarchy: "一级", sortTheValue: 10, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
    { id: 11, serialNumber: 11, poolName: "语文试卷", classificationHierarchy: "一级", sortTheValue: 11, createdBy: "加佳", lastModified: "2023-05-12 18:43:09" },
]
let id = questionArr.length;
let oTbody = document.querySelector('tbody');
let oTzdiv = document.querySelector('.tz-page-div');
let delBtn = document.querySelector('.del-btn');
let searchBtn = document.querySelector('.search-btn');
let searchCon = document.querySelector('.search-con');
let oSearchCoe = document.querySelector('.search-coe');
let addBtn = document.querySelector('.add-btn');
let addSerialNumber = document.querySelector('.add-serialNumber');
let addPoolName = document.querySelector('.add-poolName');
let addClassificationHierarchy = document.querySelector('.add-classificationHierarchy');
let addSortTheValue = document.querySelector('.add-sortTheValue');
let addCreatedBy = document.querySelector('.add-createdBy');
let addLastModified = document.querySelector('.add-lastModified');
let editBtn = document.querySelector('.edit-btn');
let editSerialNumber = document.querySelector('.edit-serialNumber');
let editPoolName = document.querySelector('.edit-poolName');
let editClassificationHierarchy = document.querySelector('.edit-classificationHierarchy');
let editSortTheValue = document.querySelector('.edit-sortTheValue');
let editCreatedBy = document.querySelector('.edit-createdBy');
let editLastModified = document.querySelector('.edit-lastModified');
let cheksBox = document.querySelector('.cheks-box')
let emptyBtn = document.querySelector('.empty-btn');
let oInquire3 = document.querySelector('#Inquire3');
let cheBox = document.getElementsByName('che-box')
let n = questionArr.length - 1;
let count = 5; //每页的个数
let count2 = 4; //每页的个数
let count3 = 3; //每页的个数
let iNow = 1; //当前页数
let show;   //显示页面
let i = document.querySelector('i');
let jump = document.querySelector('.jump');
let pageSres = document.querySelector('#pagesres')
let delId = 0;
let editId = 0;
let checked = document.querySelectorAll("[name='che-box']:checked")
function render(iNow, num, arr) {
    //判断每页条数
    if (show == count) {
        num = count;
    } else if (show == count2) {
        num = count2;

    } else if (show == count3) {
        num = count3

    } else {
        num = count;
    }

    //创建内容
    let str = ''
    let renderData = arr.slice((iNow - 1) * num, iNow * num);
    for (let i = 0; i < renderData.length; i++) {
        str += `<tr>
                                    <td><input type="checkbox" name="che-box" data-id="${renderData[i].id}" value="option1">&nbsp;&nbsp;${renderData[i].serialNumber}</td>
                                    <td>${renderData[i].poolName}</td>
                                    <td>${renderData[i].classificationHierarchy}</td>
                                    <td>${renderData[i].sortTheValue}</td>
                                    <td>${renderData[i].createdBy}</td>
                                    <td>${renderData[i].lastModified}</td>
                                    <td data-id="${renderData[i].id}">
                                    <button data-toggle="modal" data-target="#delModal" class="btn btn-danger del">删除</button>
                                    <button class="btn btn-warning edit" data-toggle="modal" data-target="#editModal">修改</button>
                                    </td>
                              </tr>
        `


    }
    oTbody.innerHTML = str;
    //创建页码
    let pagesLeft = `<button class="left"><span class="glyphicon glyphicon-menu-left left" aria-hidden="true"></span></button>`
    let pagesRight = `<button class="right"><span class="glyphicon glyphicon-menu-right right" aria-hidden="true"></span></button>`
    //创建每页多少条
    var pagesres = ``
    //如果点击的是页码，在让当前页码显示
    let pagesStr = ''
    for (let i = 1; i <= Math.ceil(arr.length / num); i++) {
        if (iNow == i) {
            pagesStr += `<button class="active-s yeam">${i}</button>`
        } else {
            pagesStr += `<button class="yeam">${i}</button>`
        }
    }
    oTzdiv.innerHTML = pagesLeft + pagesStr + pagesRight


}


//页面加载就渲染
render(iNow, show, questionArr)

//分页功能
oTzdiv.addEventListener('click', function (e) {

    if (e.target.className.includes('left')) {//左
        console.log('zuo');

        if (iNow > 1) {
            iNow--;
            render(iNow, show, questionArr)
        }

    } else if (e.target.className.includes('right')) {//右
        if (iNow < Math.ceil(questionArr.length / count)) {
            iNow++;
            render(iNow, show, questionArr)

        }


    } else if (e.target.className.includes('yeam')) { //数字键
        console.log('dain');
        iNow = e.target.innerText.trim();
        render(iNow, show, questionArr)
    }
});
//跳转的功能
function JumpPage() {
    let pages = Math.ceil(questionArr.length / count);
    if (1 <= jump.value && jump.value <= pages) {
        render(jump.value, show, questionArr)
    }
}
i.addEventListener('click', JumpPage);
jump.addEventListener('keyup', JumpPage);
//增加页数显示条件改变的功能
function changepage() {
    let src = pageSres.value
    console.log(src);
    switch (src) {
        case "5":
            show = count;
            render(iNow, show, questionArr);
            break;
        case "4":
            show = count2
            render(iNow, show, questionArr);
            break;
        case "3":
            show = count3
            render(iNow, show, questionArr);
            break;

    }
}

//所有的删除添加事件
oTbody.addEventListener('click', function (e) {
    //删除
    if (e.target.className.includes('del')) {
        delId = e.target.parentNode.dataset.id
        console.log(delId);
    } else if (e.target.className.includes('edit')) {
        //显示编辑框，赋值
        console.log(e.target);
        editSerialNumber.value = e.target.parentNode.parentNode.children[0].innerText;
        editPoolName.value = e.target.parentNode.parentNode.children[1].innerText;
        editSortTheValue.value = e.target.parentNode.parentNode.children[3].innerText;
        editCreatedBy.value = e.target.parentNode.parentNode.children[4].innerText;
        editLastModified.value = e.target.parentNode.parentNode.children[5].innerText;




        let str = e.target.parentNode.parentNode.children[2].innerText;

        document.querySelector('.edit-class option[value = ' + str + ']').selected = true;
        editId = e.target.parentNode.dataset.id;
        console.log(editId);

    }
})

// //点删除确定的时候
delBtn.addEventListener('click', function () {
    for (let i = 0; i < questionArr.length; i++)
        if (questionArr[i].id == delId) {
            questionArr.splice(i, 1);

            let renderData = questionArr.slice((iNow - 1) * count, iNow * count);
            if (renderData.length == 0 && iNow > 1) {
                iNow--;
            }
            searchCon.value = '';
            render(iNow, show, questionArr);
            return;
        }
})

//跳转页面事件
pageSres.addEventListener('click', changepage)
searchBtn.addEventListener('click', function () {
    let finderArr = [];
    let str = searchCon.value;
    let ste = oSearchCoe.value;
    for (let i = 0; i < questionArr.length; i++) {
        if (questionArr[i].poolName.includes(str) && questionArr[i].classificationHierarchy.includes(ste)) {//符合条件的
            finderArr.push(questionArr[i])

        }
    }
    render(iNow, show, finderArr)
})

//点击添加的时候
addBtn.addEventListener('click', function () {
    questionArr.push({
        id: ++id,
        serialNumber: addSerialNumber.value,
        poolName: addPoolName.value,
        classificationHierarchy: addClassificationHierarchy.value,
        sortTheValue: addSortTheValue.value,
        createdBy: addCreatedBy.value,
        lastModified: addLastModified.value
    })
    render(iNow, show, questionArr)
})

//点击修改的时候
editBtn.addEventListener('click', function () {
    console.log(1);

    let json = {
        id: editId,
        serialNumber: editSerialNumber.value,
        poolName: editPoolName.value,
        classificationHierarchy: editClassificationHierarchy.value,
        sortTheValue: editSortTheValue.value,
        createdBy: editCreatedBy.value,
        lastModified: editLastModified.value


    }
    for (let i = 0; i < questionArr.length; i++) {
        if (questionArr[i].id == editId) {
            questionArr.splice(i, 1, json)

        }

    }
    render(iNow, show, questionArr)
    console.log(json);
})

//清空按钮
emptyBtn.addEventListener('click', function () {
    searchCon.value = '';
    oSearchCoe.value = '';
    render(iNow, show, questionArr)

})

// 批量删除
oInquire3.addEventListener('click', function () {
    for (let i = 0; i < checked.length; i++){
    let   checkedId  = checked[i].dataset.id
    for(let j=0; j<questionArr.length; i++){
        

    }

    }

})

// 全选的删除
cheksBox.addEventListener('click', function () {
    for (let i = 0; i < cheBox.length; i++) {
        cheBox[i].checked = this.checked;

    }
})